<div id="xzb_gudingzichan">
<section class="content-header">
  <h1>
    固定资产
    <small>行政部</small>
  </h1>
  <ol class="breadcrumb">
    <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
    <li>行政部</li>
    <li class="active">固定资产</li>
  </ol>
</section>

<section class="content">
  <div class="row">
    <div class="col-xs-12">
      <div class="box">
        <div class="box-header">
          <div class="btn-group pull-left" data-type="actionBar">
            <button type="button" class="btn btn-default" data-action="add">固定资产导入</button>
            <button type="button" class="btn btn-default" data-action="add_0">添加</button>
            <button type="button" class="btn btn-default" data-action="change">调整</button>
            <button type="button" class="btn btn-default" data-action="reback">归还</button>
            <button type="button" class="btn btn-default" data-action="destroy">报废</button>
          </div>
          <div class=" pull-right" data-type="columnControl">
          </div>
          <div class=" pull-right " data-type="searchControl">
          </div>
          <div class="clearfix"></div>
        </div>
        <div class="box-body">
          <table class="table table-bordered table-striped table-hover"></table>
        </div>
      </div>
    </div>
  </div>
</section>

<script type="text/template" data-for="tp_editor">
  <form role="form" class="form-horizontal">
    <div class="box-body">
        <div class="form-group">
            <label class="col-sm-2 control-label">选择文件</label>
            <div class="col-sm-4">
                <input type="file" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">进度</label>
            <div class="col-sm-10">
                <div class=" progress">
                    <div class="progress-bar progress-bar-primary progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                        <span class="sr-only">40% Complete (success)</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
  </form>
</script>

<script type="text/template" data-for="tp_editor1">
  <form role="form" class="form-horizontal">
    <div class="box-body">
      <div class="form-group">
        <label class="col-sm-2 control-label">操作人</label>
        <div class="col-sm-4">
          <input type="text" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
        </div>
        <label class="col-sm-2 control-label">当前时间</label>
        <div class="col-sm-4">
          <div class="input-group date">
            <div class="input-group-addon">
              <i class="fa fa-calendar"></i>
            </div>
            <input type="text" class="form-control pull-right" data-plugin="date" name="p8" value="<%=data.p8?data.p8:''%>">
          </div>
        </div>
      </div>
      <div class="form-group">
        <label class="col-sm-2 control-label">调整数量</label>
        <div class="col-sm-4">
          <input type="text" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
        </div>
        <label class="col-sm-2 control-label">调整部门</label>
        <div class="col-sm-4">
          <select class="form-control">
            <option>租摆部门</option>
            <option>工程部</option>
            <option>行政部</option>
          </select>
        </div>
      </div>
      <div class="form-group">
        <label class="col-sm-2 control-label">备注</label>
        <div class="col-sm-10">
          <textarea class="form-control">
            <%=data.p1?data.p1:''%>
          </textarea>
        </div>
      </div>
    </div>
  </form>
</script>

  <script type="text/template" data-for="tp_editor2">
    <form role="form" class="form-horizontal">
      <div class="box-body">
        <div class="form-group">
          <label class="col-sm-2 control-label">操作人</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
          </div>
          <label class="col-sm-2 control-label">当前时间</label>
          <div class="col-sm-4">
            <div class="input-group date">
              <div class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </div>
              <input type="text" class="form-control pull-right" data-plugin="date" name="p8" value="<%=data.p8?data.p8:''%>">
            </div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label">备注</label>
          <div class="col-sm-10">
          <textarea class="form-control">
            <%=data.p1?data.p1:''%>
          </textarea>
          </div>
        </div>
      </div>
    </form>
  </script>

  <script type="text/template" data-for="tp_editor3">
    <form role="form" class="form-horizontal">
      <div class="box-body">
        <div class="form-group">
          <label class="col-sm-2 control-label">操作人</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
          </div>
          <label class="col-sm-2 control-label">当前时间</label>
          <div class="col-sm-4">
            <div class="input-group date">
              <div class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </div>
              <input type="text" class="form-control pull-right" data-plugin="date" name="p8" value="<%=data.p8?data.p8:''%>">
            </div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label">报废原因</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" name="p1" value="<%=data.p1?data.p1:''%>">
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label">备注</label>
          <div class="col-sm-10">
          <textarea class="form-control">
            <%=data.p1?data.p1:''%>
          </textarea>
          </div>
        </div>
      </div>
    </form>
  </script>


<script>
  USEN(function () {
    //模块ID(全系统唯一)
    var id = "#xzb_gudingzichan";
    var addId = "xzb_gudingzichan_add";
    var modifyId = "xzb_gudingzichan_modify";

    //定义页面变量
    var $el = $(id);
    var $actionBar = $el.find("[data-type=actionBar]");
    var tableId = id + " table.table";
    var $table = $(tableId);
    var $editor = $el.find("[data-for=tp_editor]");
    var $editor1 = $el.find("[data-for=tp_editor1]");
    var $editor2 = $el.find("[data-for=tp_editor2]");
    var $editor3 = $el.find("[data-for=tp_editor3]");
    var myTable;


    //定义增\删\改 方法
    var editor = {
    	add_0:function(){
        USEN.load(USEN.router[addId]);
      },
      add : function(){
        USEN.modal({
          title:"导入",
          submitTxt:"确定",
          submitCb:function($el){
            //提交表单
            $el.find("form").ajaxSubmit({
              url: './simdata/common_add_action.json',
              beforeSubmit: function (data) {
//                console.log("数据提交之前.")
              },
              success: function (data, state, obj) {
                USEN.notifyAlert({
                  title:"提示:",
                  content:'提交成功,刷新Table组件'
                });
                $el.modal("hide");
                if (myTable) myTable.ajax.reload();
              }
            })
          },
          filter:function(data){
            return _.template($editor.html())({
              data:data
            });
          }
        })
      },
      change:function(){
        USEN.modal({
          title:"调整",
          submitTxt:"确定",
          submitCb:function($el){
            //提交表单
            $el.find("form").ajaxSubmit({
              url: './simdata/common_add_action.json',
              beforeSubmit: function (data) {
//                console.log("数据提交之前.")
              },
              success: function (data, state, obj) {
                USEN.notifyAlert({
                  title:"提示:",
                  content:'提交成功,刷新Table组件'
                });
                $el.modal("hide");
                if (myTable) myTable.ajax.reload();
              }
            })
          },
          filter:function(data){
            return _.template($editor1.html())({
              data:data
            });
          }
        })
      },
      reback:function(){
        USEN.modal({
          title:"归还",
          submitTxt:"确定",
          submitCb:function($el){
            //提交表单
            $el.find("form").ajaxSubmit({
              url: './simdata/common_add_action.json',
              beforeSubmit: function (data) {
//                console.log("数据提交之前.")
              },
              success: function (data, state, obj) {
                USEN.notifyAlert({
                  title:"提示:",
                  content:'提交成功,刷新Table组件'
                });
                $el.modal("hide");
                if (myTable) myTable.ajax.reload();
              }
            })
          },
          filter:function(data){
            return _.template($editor2.html())({
              data:data
            });
          }
        })
      },
      remove: function (data) {
        USEN.modal({
          title: "提示",
          content: "是否删除这条数据?",
          submitTxt: "删除",
          submitCb: function ($el) {
            $.ajax({
              url: "./simdata/common_remove_action.json",
              data: data,
              success: function (result) {
                USEN.notifyAlert({
                  title: "提示:",
                  content: '删除成功.'
                });
                $el.modal("hide");
                if (myTable) myTable.ajax.reload();
              }
            })
          }
        })
      },
      destroy:function(){
        USEN.modal({
          title:"报废",
          submitTxt:"确定",
          submitCb:function($el){
            //提交表单
            $el.find("form").ajaxSubmit({
              url: './simdata/common_add_action.json',
              beforeSubmit: function (data) {
//                console.log("数据提交之前.")
              },
              success: function (data, state, obj) {
                USEN.notifyAlert({
                  title:"提示:",
                  content:'提交成功,刷新Table组件'
                });
                $el.modal("hide");
                if (myTable) myTable.ajax.reload();
              }
            })
          },
          filter:function(data){
            return _.template($editor3.html())({
              data:data
            });
          }
        })
      },
      modify: function (data) {
         USEN.load(USEN.router[modifyId]);
      }
    };

    // 绑定列表编辑按钮事件
    $actionBar.find("[data-action]").on("click",function(){
      var action = $(this).data("action");
      var $selected = $table.find('tr.selected');
      switch(action){
      	 case "add_0" :
          editor.add_0();
          break;
        case "add" :
          editor.add();
          break;
        case "change" :
          editor.change();
          break;
        case "reback" :
          editor.reback();
          break;
        case "destroy" :
          editor.destroy();
          break;
      }
    });

    //初始化datatable数据列表
    myTable = new USEN.Datatable({
      "scrollX": false,
      //设置ID
      "id":tableId,
      //设置列控制模块容器
      "columnControl":id + " [data-type=columnControl]",
      //设置搜索模块容器
      "searchControl":id + " [data-type=searchControl]",
      //每行"操作"自定义action按钮回调
      onItemAction:function($tr,action){
        switch(action){
          case "modify" :
            editor.modify(this.row( $tr ).data());
            break;
          case "delete" :
            editor.remove(this.row( $tr ).data());
            break;
        }
      },
      //配置服务
      "ajax": "./simdata/common_table_ation.json",
      //列设置
      "columns": [
        {
          data: null,
          defaultContent: '',
          className: 'select-checkbox',
          orderable: false, searchable: false,
          width:"30px"
        },
        { "title": "操作", "data": null, orderable: false, searchable: false, width: '200px', render: function (data, type, full, meta) {
          return  '<button data-item-action="modify" class="btn btn-primary">修改</button>&nbsp;&nbsp;' +
                  '<button data-item-action="delete" class="btn btn-danger">删除</button>'
        }},
        { "title":"序号", "data": "p1"},
        { "title":"区域位置","data": "p2" },
        { "title":"设备名称","data": "p3" },
        { "title":"规格型号","data": "p4" },
        { "title":"单位","data": "p5" },
        { "title":"数量","data": "p6" },
        { "title":"所属部门","data": "p6" },
        { "title":"所属人","data": "p6" }
      ]
    })
  });
</script>
</div>